<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
	{% include 'common-css/css.html' %}
	<link href="{{ STATIC_URL }}common/index.css" rel="stylesheet" type="text/css"/>
	<title>博客首页</title>
</head>
<body>
<div class="quote blog-header">
	yzw_blog
	<a href="/register" class="layui-btn layui-btn-radius layui-btn-normal" style="float: right;">注 册</a>
	<a href="/login" class="layui-btn layui-btn-radius layui-btn-warm" style="float: right;margin-right: 10px">登
		录</a>
</div>
{% comment %}博客列表 begin{% endcomment %}
<div class="layui-row">
	<div class="layui-col-md8 blog-body">
		<div class="blog-panel">
			<div class="blog-list-title">
				<h4>博客列表</h4>
				<hr class="layui-bg-blue">
			</div>
			<ul>
				<li>
					<div id="blog_list"></div>
				</li>
			</ul>
		</div>
	</div>
	<div class="layui-col-md4 blog-body">
		<div class="blog-panel">

		</div>
	</div>
</div>
{% comment %}博客列表 end{% endcomment %}
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}layui/layui.js"></script>
<script type="text/javascript">
	layui.use(['form', 'util'], function () {
		var util = layui.util;
		util.fixbar({});
		var blog_list = $('#blog_list');
		$.ajax({
			type: 'post',
			url: '/index_blog_list',
			data: {},
			dataType: 'json',
			success: function (data) {
				blog_list.empty();
				if (data.length > 0) {
					$.each(data, function (i, v) {
						blog_list.append
						(
							'<span class="blog-title"><a href="/index_blog_details?id=' + v.id + '" target="_blank">' + v.title + '</a></span>' +
							'<a class="layui-badge">' + v.classify + '</a>' +
							'<p>' +
							'    <span><i class="layui-icon">&#xe612;  </i>' + v.author + '</span>' +
							'    <span><i class="layui-icon">&#xe60e;  </i>' + v.create_time + '</span>' +
							'    <span><i class="layui-icon">&#xe756;  </i>' + v.pv_num + '</span>' +
							'</p>' +
							'<hr class="layui-bg-gray">'
						);
					});
				}
			}
		});
	})
</script>
</body>
</html>